<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>

</head>
<body>
<button id="id_start">开启监听</button>
|
<button id="id_end">关闭监听</button>
</body>
<script>
    var ws = null;

    function startWebSocket() {
        ws = new WebSocket('ws://127.0.0.1:8000/ws/monitor/');
        ws.onopen = function () {
            console.log('WebSocket连接已建立');
        }
        ws.onmessage = function (e) {
            var data = JSON.parse(e.data);
            console.log(data)
        };
        ws.onclose = function (e) {
            console.log(e);
        };
    }


    $("#id_start").click(function () {
        startWebSocket();
    })
    $("#id_end").click(function () {
        ws.close()
    })
</script>
</html>